$(function () {
    // alert('ok')
    // 1 获取文章列表
    initArtCatelist()

    function initArtCatelist() {
        $.ajax({
            url: '/my/article/cates',
            method: 'get',
            data: {},
            success: function (res) {
                console.log(res);
                if (res.status !== 0) {
                    return layui.layer.msg(res.message, {
                        icon: 5
                    });
                }
                // 利用模板引擎直接渲染到页面
                var htmlStr = template('tpl-cate', res);
                $('tbody').html(htmlStr)
            }
        })
    }

    // 2添加分类
    var indexAdd;
    $('#btnAddCate').on('click', function () {
        indexAdd = layui.layer.open({
            type: 1,
            titel: '添加分类',
            area: ['500px', '300px'],
            content: $('#dialog-add').html()
        })
    })

    // 2-1完成分类添加
    $('body').on('submit', '#form-add', function (e) {
        e.preventDefault();
        var data = $(this).serialize();
        // console.log(data);
        $.ajax({
            url: '/my/article/addcates',
            method: 'post',
            data: data,
            success: function (res) {
                console.log(res);
                if (res.status !== 0) {
                    return layui.layer.msg(res.message, {
                        icon: 5
                    });
                }
                layui.layer.msg('数据添加成功', {
                    icon: 6
                });
                // 关闭模态框
                layui.layer.close(indexAdd);
                // 重新渲染数据
                initArtCatelist();
            }
        })
    })

    // 3编辑分类
    var indexEdit
    // 3-1点击编辑按钮弹出模态框 因为是动态渲染出来的所以得添加事件委派
    $('tbody').on('click', '.btn-edit', function () {
        indexEdit = layui.layer.open({
            type: 1,
            title: '编辑分类',
            area: ['500px', '300px'],
            content: $('#dialog-edit').html()
        })
        // 3-2把之前的分类渲染到表单中
        // 获取被编辑分类的id
        var id = $(this).attr('data-id');
        // console.log(id);
        // 根据id获取被编辑数据的信息
        $.ajax({
            url: '/my/article/cates/' + id,
            method: 'get',
            success: function (res) {
                // console.log(res);
                // 给表单赋值
                layui.form.val('form-edit', res.data)
            }
        })
    })

    // 3-3完成编辑功能
    $('body').on('submit', '#form-edit', function (e) {
        e.preventDefault();
        var data = $(this).serialize()
        // console.log(data);
        $.ajax({
            url: '/my/article/updatecate',
            method: 'post',
            data: data,
            success: function (res) {
                console.log(res);
                if (res.status !== 0) {
                    return layui.layer.msg(res.message, {
                        icon: 5
                    });
                }
                layui.layer.msg('更新分类成功', {
                    icon: 6
                });
                // 关闭模态框
                layui.layer.close(indexEdit);
                // 重新渲染数据
                initArtCatelist();
            }
        })
    })

    // 4删除分类
    $('tbody').on('click', '.btn-delete', function () {
        // console.log(1);
        // 获取被删除分类的id
        var id = $(this).attr('data-id')
        // console.log(id);
        // layui询问
        layui.layer.confirm('确定要删除数据吗?', {
            icon: 3,
            title: '提示'
        }, function (index) {
            //do something
            // 调接口删除分类
            $.ajax({
                url: '/my/article/deletecate/' + id,
                method: 'get',
                success: function (res) {
                    console.log(res);
                    // 判断
                    if (res.status !== 0) {
                        return layui.layer.msg(res.message, {
                            icon: 5
                        })
                    }
                    layui.layer.msg('删除数据成功', {
                        icon: 6
                    })
                    // 重新渲染数据
                    initArtCatelist()
                }
            })
            layer.close(index);
        });
    })
})